<template>
	<!-- 统计排行 -->
	<view class="stati">
		<view class="ical">
			<view class="tui">
				<text style="margin-bottom: 20px;">推广人数</text>
				<view class="guang">{{ counts }}</view>
			</view>
			<view class="img">
				<image src="../../static/distribution/ren.png" mode=""></image>
			</view>
		</view>
		<view class="sou">
			<view class="jibie">
				<view class="yi">一级(0)</view>
				<view class="er">二级(0)</view>
			</view>
			<view class="inou">
				<input
					class="input"
					type="text"
					placeholder="点击搜素会员名称"
				/>
				<view class="sss">
					<u-icon name="search" color="#c1c1c1" size="28"></u-icon>
				</view>
			</view>
			<view class="tjd">
				<view class="tuan" style="margin-left: 10px;">团级排序</view>
				<view class="">金额排序</view>
				<view class="" style="margin-right: 10px;">订单排序</view>
			</view>
		</view>
		<Aside></Aside>
	</view>
</template>

<script>
import Aside from "@/components/asideNav.vue";
import {pepole} from "../../network/pointer.js";
export default {
	data() {
		return {
			counts: ""
		};
	},
	components: {
		Aside
	},
	async created() {
		let res = await pepole();
		console.log("dd", res);
		this.counts = res.data.count;
	}
};
</script>

<style scoped>
.stati {
	width: 100vw;
	height: 100vh;
	background-color: #f5f5f5;
}
.ical {
	background-color: #e93323;
	width: 100vw;
	height: 15vh;
}
.tui {
	color: #fff;
	position: absolute;
	left: 10vw;
	top: 5vh;
	font-size: 20px;
}
.guang {
	margin-top: 10px;
	font-size: 25px;
}
image {
	width: 80px;
	height: 80px;
	position: absolute;
	left: 70vw;
	top: 5vh;
}
.sou {
	width: 90vw;
	height: 13vh;
	background-color: #fff;
	border-radius: 15px;
	position: absolute;
	left: 5vw;
	top: 13vh;
}
.jibie {
	width: 90vw;
	height: 6vh;
	border-radius: 15px;
	display: flex;
	justify-content: space-between;
	border-bottom: 1px solid #ccc;
}
.yi {
	margin-top: 20px;
	margin-left: 50px;
}
.er {
	margin-top: 20px;
	margin-right: 50px;
}
.yi:hover {
	color: red;
	border-bottom: 2px solid red;
}
.er:hover {
	color: red;
	border-bottom: 2px solid red;
}
.input {
	background-color: #c1c1c1;
	width: 60vw;
	height: 4vh;
	position: absolute;
	left: 10vw;
	top: 8vh;
	border-radius: 15px;
	text-align: center;
}
.sss {
	position: absolute;
	top: 8vh;
	left: 75vw;
}
.tjd {
	width: 90vw;
	height: 5vh;
	background-color: #fff;
	margin-top: 77px;
	border-radius: 5px;
	display: flex;
	justify-content: space-between;
	line-height: 5vh;
}
</style>
